<!--登录-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>系统登录</title>
<link href="/hotel/css/login.css" rel="stylesheet" rev="stylesheet" type="text/css" media="all" />
<link href="/hotel/css/demo.css" rel="stylesheet" rev="stylesheet" type="text/css" media="all" />
<style>
	#span1{
		visibility:hidden;
	}
	#span2{
		visibility:hidden;
	}
	#btn1{
		width: 243px;
        height: 40px;
        background-color: #d2b807;
	}
</style>
</head>

<body>


<div class="header">
  <h1 class="headerLogo"><a title="后台管理系统" target="_blank" href="#"><img alt="logo" src="/hotel/img/logo.gif"></a></h1>
</div>

<div class="banner">

<div class="login-aside">
  <div id="o-box-up"></div>
  <div id="o-box-down"  style="table-layout:fixed;">
   <div class="error-box"></div>
   <form class="registerform" action="/rootLogin" method="post">
   <div class="fm-item">
	   <label for="logonId" class="form-label" id="label1">账号：</label>
	   <span id="span1">账户不能为空且不能为中文</span>
	   <input type="text" required="required" maxlength="100" name="username" id="username" class="i-text" onfocus="onfocusUser()" onblur="onblurUser()"></input>
       <div class="ui-form-explain"></div>
  </div>
  
  <div class="fm-item">
	   <label for="logonId" class="form-label" id="label2">密码：</label>
	   <span id="span2">密码不能为空</span>
	   <input type="password" required="required" maxlength="100" name="password" id="password" class="i-text" onfocus="onfocusPwd()" onblur="onblurPwd()"></input>
       <div class="ui-form-explain"></div>
  </div>
 <!--
  <div class="fm-item pos-r">
	   <label for="logonId" class="form-label">验证码</label>
	   <input type="text" value="输入验证码" maxlength="100" id="yzm" class="i-text yzm" nullmsg="请输入验证码！" >    
       <div class="ui-form-explain"><img src="/hotel/img/yzm.jpg" class="yzm-img" /></div>
  </div>
  -->
  <div class="fm-item">
	   <label for="logonId" class="form-label"></label>
	   <button type="button" id="btn1">登   录</button>
       <div class="ui-form-explain"></div>
  </div>
  
  </form>
  
  </div>

</div>

	<div class="bd">
		<ul>
			<li style="background:url(/hotel/img/login2.jpg) #BCE0FF center 0 no-repeat;"><a target="_blank" href="javascript:;"></a></li>
            <li style="background:url(/hotel/img/timg.jpg) #CCE1F3 center 0 no-repeat;"><a target="_blank" href="javascript:;"></a></li>
		</ul>
	</div>

	<div class="hd"><ul></ul></div>
</div>
<div class="banner-shadow"></div>
<div class="footer">
   <p>版权所有 &copy; MISS商务国际酒店</p>
</div>
<script src="/hotel/js/jquery.min.js"></script>
<script type="text/javascript" src="/hotel/js/jQuery-2.2.2-min.js"></script>
<script type="text/javascript" src="/hotel/js/jquery.SuperSlide.js"></script>
<script type="text/javascript" src="/hotel/js/Validform_v5.3.2_min.js"></script>
<script>
$("#btn1").click(function(){
	var username = $("#username").val();
	var password = $("#password").val();
	$.ajax({
		type:"post",
		url:"/root/"+username+"/"+password+"",
		async:true,
		success:function(mes){
			if(mes==true){
				window.location.href="/hotel/html/index.html"
			}else{
				alert("密码或用户名输入错误")
			}
		}
	});
});
    function onblurUser() {
        var eValue = $("#username").val();
        var e = document.getElementById("span1");
        if(!/^\w{1,50}$/.test(eValue)){
            e.style.visibility="visible";
            e.style.color="red";
        }
    }
    function onblurPwd() {
        var pValue = $("#password").val();
        var p = document.getElementById("span2");
        if(!/^\S{6,16}$/.test(pValue)){
        	p.style.visibility="visible";
        	 p.style.color="red";
        }
    }
    function onfocusUser() {
        var e = document.getElementById("span1");
            e.style.visibility="hidden";
            
    }
    function onfocusPwd() {
    	var p = document.getElementById("span2");
        	p.style.visibility="hidden";
    }
</script>
</body>
</html>
